import { defineStore } from 'pinia'
import { ref } from 'vue'

export const useAppStore = defineStore('app', () => {
  const loading = ref<boolean>(false)
  const sidebarCollapsed = ref<boolean>(false)
  const breadcrumbs = ref<Array<{ name: string; path?: string }>>([])

  const setLoading = (status: boolean) => {
    loading.value = status
  }

  const toggleSidebar = () => {
    sidebarCollapsed.value = !sidebarCollapsed.value
  }

  const setSidebarCollapsed = (collapsed: boolean) => {
    sidebarCollapsed.value = collapsed
  }

  const setBreadcrumbs = (crumbs: Array<{ name: string; path?: string }>) => {
    breadcrumbs.value = crumbs
  }

  const addBreadcrumb = (crumb: { name: string; path?: string }) => {
    breadcrumbs.value.push(crumb)
  }

  return {
    loading,
    sidebarCollapsed,
    breadcrumbs,
    setLoading,
    toggleSidebar,
    setSidebarCollapsed,
    setBreadcrumbs,
    addBreadcrumb
  }
}, {
  persist: true
})